<!doctype html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <title>Data Bunker - audit events</title>
  <script src="conf.js"></script>
  <script src="site.js"></script>
  <link rel="stylesheet" href="css/bootstrap.min.css">
  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css"
    integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
  <link rel="stylesheet" href="css/bootstrap-table.min.css">
  <link rel="stylesheet" href="style.css">

  <script src="js/jquery.min.js"></script>
  <script src="js/bootstrap.bundle.min.js"></script>
  <script src="js/bootstrap-table.min.js"></script>

  <script src="js/jdd.js" type="text/javascript" charset="utf-8"></script>
  <link rel="stylesheet" href="css/jdd.css">

  <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.10/highlight.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.10/languages/json.min.js"></script>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.10/styles/a11y-dark.min.css">

  <script>
    var xtoken = window.localStorage.getItem('xtoken');
    var token = window.localStorage.getItem('token');
    function displayTargetObject(target, row, index) {
      if (row.mode) {
        return '(' + row.mode + ') ' + target;
      }
      return target;
    }
    function displayActivity(title, row, index) {
      var app = '';
      if (row.app) {
        app = '(' + row.app + ') ';
      }
      result = '';
      if (row.status && row.status == "ok") {
        result = '<i class="fas fa-check"></i>&nbsp;' + app + title;
      } else {
        result = '<i class="fas fa-times"></i>&nbsp;' + app + title;
      }
      if (row.msg) {
        if (row.status && row.status == "ok") {
          result = result + '<br/><i class="fas fa-check"></i>&nbsp;' + shortString(row.msg);
        } else {
          result = result + '<br/><i class="fas fa-times"></i>&nbsp;' + shortString(row.msg);
        }
      }
      return result;
    }
    function displayDrillDownLink(atoken, row, index) {
      if (row.more) {
        //console.log(row);
        return '<a href=\'javascript:displayAudit(\"' + atoken + '\");\'>View</a>';
      }
      return '';
    }
    var confirmModal;

    function displayAudit(atoken) {
      var xhr0 = new XMLHttpRequest();
      // first save consent
      xhr0.open('GET', '/v1/audit/get/' + atoken, false);
      xhr0.setRequestHeader("X-Bunker-Token", xtoken)
      xhr0.setRequestHeader('Content-type', 'application/json');
      xhr0.onload = function () {
        if (xhr0.status === 200) {
          var data = JSON.parse(xhr0.responseText);
          if (data.status == "ok") {
            data = data.event;
            var d = JSON.stringify(data, null, 4);
            setTimeout(function () {
              if (data["before"] && data["after"]) {
                var code = '<div class="diffcontainer"><div id="report"></div>'+
			   '<pre id="out" class="left" class="codeBlock"></pre>'+
		           '<pre id="out2" class="right" class="codeBlock"></pre>'+
			   '</div>';
                $('#drilldown').html(code);
                jdd.compare(data["before"], data["after"]);
	          } else {
	            $('#drilldown').html('<pre><code class="json">' + d + '</code></pre>');
                document.querySelectorAll('pre code').forEach((block) => {
                  hljs.highlightBlock(block);
                });
              }
            }, 300);
          }
        }
      }
      xhr0.send();

      var heading = "Audit drill-down report";
      var text = "Display audit event: " + atoken;
      var cancelButtonTxt = "Close popup";
      if (confirmModal) {
        $('#audit-event-text').text(text)
        confirmModal.modal('show');
        return;
      }
      confirmModal =
        $('<div class="modal fade" role="dialog"><div class="modal-dialog" role="document" style="max-width: 80%;"><div class="modal-content">' +
          '<div class="modal-header">' +
          '<h5 class="modal-title">' + heading + '</h5>' +
          '<button type="button" class="close" data-dismiss="modal" aria-label="Close">' +
          '<span aria-hidden="true">&times;</span></button>' +
          '</div>' +
          '<div class="modal-body">' +
          '<p id="audit-event-text">' + text + '</p>' +
          '<div id="drilldown"></div>' +
          '</div>' +
          '<div class="modal-footer">' +
          '<a href="#" class="btn" data-dismiss="modal">' +
          cancelButtonTxt +
          '</a>' +
          '</div>' +
          '</div></div></div>');
      confirmModal.find('#okButton').click(function (event) {
        confirmModal.modal('hide');
      });
      confirmModal.modal('show');
      confirmModal.on('hidden.bs.modal', function() {
        $('#drilldown').html(null);
      });
    }

    $(function () {
      //$('#msg').text("Loading data")
      //token = "faa006da-475e-45c6-a4a1-6586dce8b8d2";
      $('#table').bootstrapTable({
        /*data: mydata */
        url: "/v1/audit/list/" + token,
        undefinedText: 'n/a',
        /* url: "data1.json", */
        method: "GET",
        ajaxOptions: {
          headers: { "X-Bunker-Token": xtoken },
          crossDomain: true
        },
        showExtendedPagination: true,
        sidePagination: "server",
        pagination: true,
        search: false,
        classes: "table",
        onLoadError: function (status, res) {
          console.log(status);
          if (status > 400 && status < 500) {
            document.location = "/";
          }
        }
      });
    });
  </script>
<script>
conf = loadUIConfiguration();
if (conf["custom_css_link"]) {
  document.write("<link rel='stylesheet' type='text/css' href='" + conf["custom_css_link"] +"' />");
}
</script>
</head>

<body>
  <div class="container">
    <div class="row col-md-12">
      <div style="width:100%;">
        <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
          <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup"
            aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>
          <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
            <ul class="navbar-nav">
		    <script>showUserMenu();</script>
            </ul>
          </div>
        </nav>
      </div>
      <div class="bigblock">
        <h4>User profile activity</h4>
        <p id="msg">A list of all operations with the profile records.</p>
        <table id="table" class="table">
          <thead>
            <tr>
              <th scope="col-4" data-field="title" data-formatter="displayActivity">Event Name</th>
              <th scope="col-1" data-field="when" data-formatter="dateFormat">Time</th>
              <th scope="col-1" data-field="identity" data-formatter="shortString">Who Accessed</th>
              <th scope="col-2" data-field="who" data-formatter="displayTargetObject">User Identifier</th>
              <th scope="col-1" data-field="atoken" data-formatter="displayDrillDownLink">Action</th>
            </tr>
          </thead>
        </table>
      </div>
    </div>
	<script>displayFooterLinks();</script>
  </div>
</body>

</html>
